{% extends "../public/base.html" %}
{% block mbody %}
<div class="top mr">
    <div class="m-left"><img src="/static/image/cd_icon.png" style="width:80%;margin-top: 10px;" ></div>
    <h1>快餐</h1>
    <div class="m-right"></div>
</div>
<div class="mbody mr" id="mbody">
    <div class="item">
        {# <div class="i-title">
            <div class="i-title-item">菜单1</div>
            <div class="i-title-item">菜单2</div>
            <div class="i-title-item">菜单3</div>
        </div> #}
        {% for i in data %}
            <div class="i-ul tselect" id="{{ i.get('Fid', '') }}">
                <div class="i-ul-img left"><img class="radius" src="/static{{ i.get('Fimg', '') }}"></div>
                <div class="i-ul-body left">
                    <div class="i-ul-title">{{ i.get('Fname', '') }}</div>
                    <div class="i-ul-title" style="font-weight: normal;">￥{{ i.get('Fprice', '') }}</div>
                    <div class="i-ul-text" style="height: 22px;line-height: 22px;">xxx+xxx+xxx</div>
                </div>
                <div class="right-text">
                    <span style="font-size:18px;font-weight:bold;" class="minux" ids="{{ i.get('Fid', '') }}">-</span>
                    <input type="text" class="number" style="width: 30px;" id="num{{ i.get('Fid', '') }}">
                    <span style="font-size:18px;font-weight:bold;" class="add" ids="{{ i.get('Fid', '') }}">+</span>
                    <span style="display: none;" class="icon-true">勾选</span>
                </div>
            </div>
        {% end %}
        <div class='after' page="{{ total }}">加载中......</div>
    </div>
</div>
<div class="bottom mr" style="height: 50px;">
    <input type="button" class="btn" id="buy" value="订购" style="height: 100%;width: 50%;float: left;">
    <a href="/user/food/old">
        <input type="button" class="btn" id="buy" value="历史订购" style="height: 100%;width: 50%;float: right;">
    </a>
</div>
<div class="palert" id="aAlert"><img src="image/loading.gif">加载中……</div>
<div class="palert" id="talert">
    <span id="textalert"></span>
    <input type="button" onclick="palert.close('#talert')" value="关闭">
</div>
{% end %}
{% block script %}
<script type="text/javascript">
$(document).ready(function(){
    ScrollItem.bind("/user/food/list?page=")
    start = function (){
        $('.tselect').unbind('click').click(function(){
            if($(this).find('.icon-true').attr('select')=='true'){
                $(this).find('.icon-true').attr('select', '')
                $(this).find('.icon-true').css('color', '#B3B3B3');
                $(this).find('.icon-true').text('勾选');
            }else{
                $(this).find('.icon-true').attr('select', 'true')
                $(this).find('.icon-true').css('color', 'red');
                $(this).find('.icon-true').text('已勾选');
            }
        });
    };
    start();
    $('.minux').click(function(){
        if($('#num'+$(this).attr('ids')).val()!=0 && $('#num'+$(this).attr('ids')).val()!=''){
            $('#num'+$(this).attr('ids')).val(parseInt($('#num'+$(this).attr('ids')).val())-1)
        }
    });
    $('.add').click(function(){
        if($('#num'+$(this).attr('ids')).val()=='')
            $('#num'+$(this).attr('ids')).val('0')
        $('#num'+$(this).attr('ids')).val(parseInt($('#num'+$(this).attr('ids')).val())+1)
    });
    $('#buy').click(function(){
        var select = $('.tselect');
        var ret = '';
        for(var i = 0;i<select.length;i++){
            if($(select[i]).find('.icon-true').attr('select')=='true'){
                var num = $(select[i]).find('.number').val();
                if(num==''){
                    $('#textalert').html("请输入购买的数量");
                    palert.open('#talert')
                    return;
                }
                ret += select[i].id + ':' + num + '|'
            }
        }
        if(ret!=''){
            $.get("/user/food/buy?info="+ret.substr(0,ret.length-1), function(data, status, xhr){ 
                // alert(data)
                palert.close("#aAlert");
                window.location.href = '/user/food/old'
            });
        }
    });
})
</script>
{% end %}